<link rel="stylesheet" href="${request.contextPath}/static/oms/iframe/plugins/fileupload/css/jquery.fileupload-ui.css">
<link href="${request.contextPath}/static/oms/iframe/plugins/bootstrap-image-picker/css/image-picker.css"  rel="stylesheet" type="text/css" />
<div class="row">
	<div class="col-md-12">
		<form id="editForm" class="form-horizontal" action="${request.contextPath}/cms/link/update" method="post" onsubmit="return false">
			<input type="hidden" id="id" name="id" value="${cmsLink.id}">
			<div class="box-body">
				<div class="form-group">
					<label id="linkSiteNameLabel" for="linkSiteName" class="col-sm-2 control-label">网站名称</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="siteName" id="linkSiteName" value="${cmsLink.siteName}" placeholder="输入网站名称...">
					</div>
				</div>
				<div class="form-group">
					<label id="linkSiteDescriptionLabel" class="col-sm-2 control-label" >网站描述</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="siteDescription" id="linkSiteDescription" value="${cmsLink.siteDescription}" placeholder="输入网站描述...">
					</div>
				</div>
				<div class="form-group">
					<label id="linkSiteLogoLabel" for="linkSiteLogo" class="col-sm-2 control-label">网站Logo</label>
					<div class="col-sm-7">
						<input type="text" class="form-control" name="siteLogo" id="linkSiteLogo" value="${cmsLink.siteLogo}" placeholder="输入网站Logo图片地址...">
					</div>
					<div class="col-sm-3">
						<span class="btn btn-success fileinput-button">
							<i class="glyphicon glyphicon-plus"></i>
							<span>选择文件</span>
							<input id="linkSiteLogoFileupload"  class="fileinput-button"  type="file" name="file"  data-url="/system/config/file/add?type=1" multiple>
						 </span>
					</div>
				</div>
				<div class="form-group">
					<label id="linkSiteUrlLabel" for="linkSiteUrl" class="col-sm-2 control-label">网站网址</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="siteUrl" id="linkSiteUrl" value="${cmsLink.siteUrl}" placeholder="输入网站网址...">
					</div>
				</div>
				<div class="form-group">
					<label id="linkSiteTypeLabel" for="linkSiteType" class="col-sm-2 control-label">网站类别</label>
					<div class="col-sm-9">
						<select class="form-control" id="linkSiteType"  name="siteType"  value="${cmsLink.siteType}" style="width: 100%;" placeholder="选择网站类别...">
						</select>
					</div>
				</div>
				<div class="form-group">
					<label id="linkSiteVisitLabel" for="linkSiteVisit" class="col-sm-2 control-label">网站访问量</label>
					<div class="col-sm-9">
						<select class="form-control" id="linkSiteVisit"  name="siteVisit" value="${cmsLink.siteVisit}" style="width: 100%;"  placeholder="选择网站访问量...">
						</select>
					</div>
				</div>
				<div class="form-group">
					<label id="linkSiteRecordInfoLabel" for="linkSiteRecordInfo" class="col-sm-2 control-label">网站备案信息</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="siteRecordInfo" id="linkSiteRecordInfo" value="${cmsLink.siteRecordInfo}" placeholder="输入网站备案信息...">
					</div>
				</div>
				<div class="form-group">
					<label id="linkEmailLabel" for="linkEmail" class="col-sm-2 control-label">邮箱</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="email" id="linkEmail" value="${cmsLink.email}" placeholder="输入邮箱...">
					</div>
				</div>
				<div class="form-group">
					<label id="linkPriorityLabel" for="linkPriority" class="col-sm-2  control-label">优先顺序</label>
					<div class="col-sm-4">
						<input  class="form-control" name="priority" id="linkPriority" type="number" value="${cmsLink.priority}" placeholder="输入优先顺序...">
					</div>
					<label id="linkStatusLabel" for="linkStatus" class="col-sm-1  control-label">状态</label>
					<div class="col-sm-4">
						<select class="form-control" id="linkStatus" name="status" style="width: 100%;" placeholder="选择状态...">
						</select>
					</div>
				</div>
				<div class="form-group">
					<label id="linkRemarkLabel" class="col-sm-2 control-label">备注</label>
					<div class="col-sm-9">
						<input type="text" class="form-control" name="remark" id="linkRemark" value="${cmsLink.remark}" placeholder="输入备注...">
					</div>
				</div>
				<div class="error-message text-center" >
					<span class="error-icon"></span>
					<span id="error-msg" class="error-msg" ></span>
				</div>
             </div>
			<div class="box-footer">
				<div class="pull-right">
               		<button type="submit" class="btn btn-primary btn-sm"><i class="fa fa-paste"></i> 更新</button>
               		<button type="button" class="btn btn-default btn-sm" data-dismiss="modal"><i class="fa fa-close"></i> 关闭</button>
				</div>
          	</div>
		</form>
	</div>
</div>
<script src="${request.contextPath}/static/oms/iframe/plugins/fileupload/js/vendor/jquery.ui.widget.js"></script>
<script src="${request.contextPath}/static/oms/iframe/plugins/fileupload/js/jquery.fileupload.js"></script>
<script type="text/javascript" src="${request.contextPath}/static/oms/iframe/plugins/bootstrap-image-picker/js/imagePicker.js"></script>
<script type="text/javascript">
function ajaxSubmit(form) {
	
	var $form = $(form);
	
	if ($form.length === 1 && $form.validate()) {
        $.ajax({
            type: 'post',
            url: form.action,
            dataType: "json",
            data: $form.serialize()
        }).done(function(result){
            if (result.success) {
                $("#lgModal").modal('hide');
                alertMsg(result.message,"success");
				dataGridReload();
            } else {
                $form.find(".error-msg").show();
                $form.find(".error-msg").html(result.message);
            }
        });
	}
}

$(function() {
    $("#linkSiteLogo").imageDynamicPicker();
    $("#linkSiteLogoFileupload").fileupload({
        url: "/system/config/file/add",
        autoUpload: true,
        dataType: 'json',
        acceptFileTypes: /\.(jpg|png|gif)$/i, //浏览器支持File API才有效
        maxFileSize: 2097152, //2M，浏览器支持File API才有效
        send: function(e, data){
            alertMsg('上传中...',"success");
        },
        done: function (e, data) {
            alertMsg("上传成功", "success");
            $("#linkSiteLogo").val(data._response.result.data.url);
        },
        fail: function(e, data) {
            alertMsg("上传失败", "success");
        }
    });
    $("#linkStatus").select2({
        data: StatusStore,
        theme: "bootstrap"
    }).val('${cmsLink.status}').trigger("change");
    $("#linkSiteType").select2({
        data: SiteTypeStore,
        theme: "bootstrap"
    }).val('${cmsLink.siteType}').trigger("change");
    $("#linkSiteVisit").select2({
        data: SiteVisitStore,
        theme: "bootstrap"
    }).val('${cmsLink.siteVisit}').trigger("change");

	var $editForm = $("#editForm");
	$editForm.validate({
        rules: {
            name: {
                required: true
            },
            priority: {
                required: true
            },
            status: {
                required: true
            }
        },
        messages: {
            name:{
                required:"名称不能为空！"
            },
            priority:{
                required:"优先顺序不能为空！"
            },
            status:{
                required:"状态不能为空！"
            }
        },
		submitHandler:ajaxSubmit,
		errorLabelContainer:".error-msg",
		wrapper:"li",
		showErrors:function(errorMap,errorList) {
			if(errorList.length>0){
				$editForm.find(".error-msg").html(errorList[0].message);
			}else{
				$editForm.find(".error-msg").html("");
			}
		},
		onkeyup: false
	});
});
</script>